﻿<!doctype html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<title>canvas demo</title>
		<link type="text/css" rel="stylesheet" href="../css/consolepanel.css" />
		<style>
			html,body{
				margin:0;
				padding:0;
				overflow:hidden;
			}
		</style>
	</head>
	<body>
		<div class="div" style=""></div>
		<script type="text/javascript" src="../src/consolepanel.js"></script>
		<script type="text/javascript">
			
			var div = document.querySelector(".div"),
				body = document.body,
				html = document.documentElement;
			div.style.height = html.clientHeight+"px";


			//第一步: 初始化控制台
			var consolePanel = new ConsolePanel();
			
			//第二步: 配置回调函数,也可以不配置的
			consolePanel.setOption({
				steerwheel:function(keyCode){
					console.log(keyCode); 	//上下左右回调
				},
				scale:function(prevScale,scale){
					console.log(scale); 	//放大,缩小回调
				}
			});

			//第三步: 添加到body下面
			body.appendChild( consolePanel.getDom() );

			//第四步: 显示控制台,默认隐藏
			consolePanel.show();

		</script>
	</body>
</html>
